<template>
	<el-row :gutter="24">
		<el-col :span="24">
			<el-card shadow="always">
				<div class="body">
					<el-table :data="tableData" stripe style="width: 100%">
						<el-table-column prop="username" label="用户" width="180" align="center"> </el-table-column>
						<el-table-column prop="contact" label="联系方式" width="180" align="center"> </el-table-column>
						<el-table-column prop="content" label="内容" align="center"> </el-table-column>
						<el-table-column prop="date" label="日期" align="center"> </el-table-column>
						<el-table-column prop="address" label="操作" align="center">
							<template slot-scope="scope">
								<el-button type="primary" size="small" align="center" plain>查看</el-button>
								<el-button type="danger" size="small" align="center" plain @click="del(scope.row.id)">删除</el-button>
							</template>
						</el-table-column>
					</el-table>
				</div>
			</el-card>
		</el-col>
	</el-row>
</template>

<script>
import { GetguestBook, delguestBook } from '@/api/guestbook';

export default {
	name: 'comment_list',
	data() {
		return {
			tableData: [],
			
		};
	},
	components: {},
	created() {
		this.GetguestBook();
	},
	mounted() {},
	methods: {
		async GetguestBook() {
			this.tableData = await GetguestBook();
		},
		async del(id) {
			try {
				await delguestBook(id);
				this.$message.success('删除成功');
				this.GetguestBook()
			} catch (err) {
				console.log(err);
			}
		},
	},
	computed: {},
	watch: {},
};
</script>

<style scoped>
.el-button--primary {
	width: 70px;
}
</style>}
